<div class="rights_box">
  <!-- 面包屑 -->
  <el-breadcrumb separator="/">
    <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
    <el-breadcrumb-item>商品管理</el-breadcrumb-item>
    <el-breadcrumb-item>分类参数</el-breadcrumb-item>
  </el-breadcrumb>
  <!-- 级联菜单 -->
  <el-row class="select_box">
    <el-cascader
      v-model="cateChecked"
      :options="cateList"
      :props="{ expandTrigger: 'hover', value: 'cat_id', label: 'cat_name' }"></el-cascader>
  </el-row>
  <!-- 选项卡 -->
  <el-row class="select_tab">
    <el-tabs v-model="activeName" type="card" >
      <el-tab-pane label="动态参数" name="first"></el-tab-pane>
      <el-tab-pane label="静态参数" name="second"></el-tab-pane>
    </el-tabs>
    <el-row>
      <el-button type="success"> 添加参数分类 </el-button>
    </el-row>
    <!-- 用户表格 -->
    <el-row class="List">
      <el-table
        :data="randerParamsInfoList"
        border
        style="width: 100%">
        <el-table-column type="expand">
          <template slot-scope="data">
            <el-form label-position="left" inline class="demo-table-expand">
              <el-tag
                style="float: left;"
                :key="item"
                v-for="item in data.row.attr_vals"
                @close="deleteInfoHandler(data.row.attr_vals, item, data.row.attr_name, data.row.attr_id)"
                closable
                :disable-transitions="false">
                {{item}}
              </el-tag>
              <el-col :span="2">
                <el-input
                  class="input-new-tag"
                  v-if="inputVisible"
                  v-model="addParamsInfo"
                  @keydown.enter.native="addParamsInfoHandler(data.row)"
                  ref="saveTagInput"
                  size="small"
                ></el-input>
                <!-- 点击添加按钮 -->
                <el-button @click="showEditTagHandler" v-else class="button-new-tag" size="small"> + New Tag</el-button>
              </el-col>
            </el-form>
          </template>
        </el-table-column>
        <el-table-column
          label="序号"
          type="index"
          width="70"
          prop="id">
        </el-table-column>
        <el-table-column
          label="商品参数名称"
          prop="attr_name">
        </el-table-column>
        <el-table-column
          label="操作"
          width="250">
          <template slot-scope="data">
            <el-tooltip class="item" effect="dark" content="编辑" placement="top-start">
              <el-button type="primary" icon="el-icon-edit" circle></el-button>
            </el-tooltip>
            <el-tooltip class="item" effect="dark" content="删除" placement="top-start">
              <el-button type="danger" icon="el-icon-delete" circle></el-button>
            </el-tooltip>
          </template>
        </el-table-column>
      </el-table>
    </el-row>
  </template>
    </el-row>
  </el-row>
  
</div>